<% title_tag t(".Settings"), @group.name %>

<div class="clearfix group-settings">
  <%= render "groups/menu" %>
  <%= form_with(model: @group, url: group_settings_path(@group), local: true, remote: true) do |form| %>
  <input type="hidden" name="_by" value="show" />
  <h1 class="title"><%= t(".Settings") %></h1>
  <h2 class="sub-title"><%= t(".Photo") %></h2>
  <div class="avatar-wrap mb-section">
    <div class="image-box">
      <%= user_avatar_tag(@group, style: :large, link: false) %>
    </div>
    <div class="form-group flex-auto">
      <p class="description text-gray">
        <%= t(".This photo will be used to identify you in BlueDoc It will be visible to anyone") %>
        <br>
        <%= t(".Use a photo or image rather than text and upload an image that is 200px square or larger") %>
      </p>
      <label class="btn-upload icon-middle-wrap link-gray-dark">
        <%= icon_tag("text-image") %>
        <%= t(".Upload new picture") %>
        <%= form.file_field :avatar, class: "js-manual-file-chooser" %>
      </label>
    </div>
  </div>
  <script>
    $("form").on("change", ".js-manual-file-chooser", (e) => {
      $form = $(e.delegateTarget);
      $form.submit();
    });
  </script>
  <% end %>

  <%= form_with(model: @group, url: group_settings_path(@group), local: true, remote: true) do |form| %>
    <h2 class="sub-title"><%= t(".Group profile") %></h2>

    <input type="hidden" name="_by" value="show" />
    <%= render "/shared/error_messages", target: @group %>

    <div class="form-group" style="max-width: 700px">
      <%= form.label :name, class: "control-label" %>
      <%= form.text_field :name, class: "form-control" %>
    </div>

    <div class="form-group" style="max-width: 700px">
      <%= form.label :url, class: "control-label" %>
      <%= form.url_field :url, class: "form-control" %>
    </div>

    <div class="form-group" style="max-width: 700px">
      <%= form.label :location, class: "control-label" %>
      <%= form.text_field :location, class: "form-control" %>
    </div>

    <div class="form-group" style="max-width: 700px">
      <%= form.label :description, class: "control-label" %>
      <%= form.text_field :description, class: "form-control" %>
    </div>

    <div class="form-group mb-button" style="max-width: 700px">
      <%= form.label :slug, class: "control-label" %>
      <%= form.text_field :slug, class: "form-control" %>
      <div class="form-text">
        <%= t(".Danger to change slug", host: Setting.host) %>
      </div>
    </div>

    <div class="actions mb-section">
      <%= form.submit t(".Update profile"), class: "btn btn-primary btn-submit" %>
    </div>
  <% end %>


  <% if can? :manage, @group %>
  <div class="sub-title">
    <h2><%= t(".Danger zone") %></h2>
  </div>
  
  <div class="form-group mb-button">
    <div class="text-main"  style="font-size: 15px">
      <%= t(".Delete this group") %>
    </div>
    <div class="form-text">
      <%= t(".Once you delete a group, there is no going back") %>
    </div>
  </div>
  <%= render "destroy" %>
  <% end %>
</div>
